<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>  <#include "/common/base_include.ftl"/></head>
<body class="gray-bg">
<div class="wrapper wrapper-content ">
    <div class="col-sm-12">
        <div class="ibox">
            <div id="toolbar" class="btn-group">
                <button type="button" class="btn  btn-primary btn-group-xs" onclick="addFinger()">
                    <i class="fa fa-plus hidden" aria-hidden="true"></i>添加
                </button>
            </div>
            <table id="exampleTable" data-mobile-responsive="true"></table>
        </div>
    </div>
</div>
<div id="addFinger" class="wrapper wrapper-content" style="margin: 0;display: none;">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <form class="form-horizontal m-t" id="signupForm">
                    <div class="ibox-content">
                        <div class="form-group">
                            <label class="col-sm-6 control-label">30s内放入手指到设备上,连续按4次：</label>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">手指：</label>
                            <div class="col-sm-9">
                                <select class="form-control" id="type">
                                    <option value="1">右拇指</option>
                                    <option value="2">右食指</option>
                                    <option value="3">右中指</option>
                                    <option value="4">右无名指</option>
                                    <option value="5">右小指</option>
                                    <option value="6">左拇指</option>
                                    <option value="7">左食指</option>
                                    <option value="8">左中指</option>
                                    <option value="9">左无名指</option>
                                    <option value="10">左小指</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">指纹：</label>
                            <div class="col-sm-9">
                                <textarea style="width: 100%;" rows="5" id="finger"></textarea>
                            </div>
                        </div>
                </form>
            </div>
        </div>
    </div>
</div>
</div>
<script type="text/javascript">
    var prefix = "/user/finger";
    var remove_url = prefix + "/remove";
    var userId = "${userId}";
    $(function () {
        var columns = [{
            radio: true
        },
            {
                field: 'id',
                title: '序号'
            }
            , {
                field: 'userId',
                title: '用户ID'
            }
            , {
                field: 'type',
                title: '手指',
                formatter: function (value, row) {
                    if ("1" == value) {
                        return '右拇指';
                    } else if ("2" == value) {
                        return '右食指';
                    } else if ("3" == value) {
                        return '右中指';
                    } else if ("4" == value) {
                        return '右无名指';
                    } else if ("5" == value) {
                        return '右小指';
                    }else  if ("6" == value) {
                        return '左拇指';
                    } else if ("7" == value) {
                        return '左食指';
                    } else if ("8" == value) {
                        return '左中指';
                    } else if ("9" == value) {
                        return '左无名指';
                    } else if ("10" == value) {
                        return '左小指';
                    }
                }
            }
            , {
                field: 'status',
                title: '状态',
                formatter: function (value, row) {
                    if ("0" == value) {
                        return '有效';
                    } else {
                        return '无效';
                    }
                }
            }
            , {
                title: '操作',
                field: 'id',
                align: 'center',
                formatter: function (value, row, index) {
                    var d = ' ' +
                        ' <button type="button" class="btn  btn-warning btn-group btn-group-xs" onclick="remove(' + row.id + ')"> <i class="fa fa-trash hidden" aria-hidden="true"></i>删除 </button>' +
                        '  ';
                    return d;
                }
            }];
        var param = function (params) {
            return {
                limit: params.limit,
                offset: params.offset,
                userId: userId
            }
        };
        loadTable(prefix + "/list", columns, param, 'id');
    });


    function addFinger() {
        $("#finger").val('');
        var open_param = {
            type: 1,
            title: '扫描指纹',
            area: ['50%', '70%'],
            btn: ['提交', '关闭'],
            content: $("#addFinger"),
            yes: function (index, layero) {
                var finger = $("#finger").val();
                if (finger == '') {
                    layer.msg("请录入指纹后提交");
                    return;
                }
                var type = $("#type").val();
                postAjax("/user/finger/save", {userId: userId, type: type, finger: finger}, function (data) {
                    layer.msg(data.msg);
                    reLoad();
                    layer.close(index);
                });
            }
        };
        layer_open(open_param);
         sendFinger();
    }

    var count = 0;

    function sendFinger() {
        count++;
        if (count == 10) {
            layer.alert("<em style='color:red'>" + "指纹读取失败，联系管理员" + "</em>");
            return;
        }
        var message = {"code": "TCSYGetFinger"};
        //连接关闭的回调方法
        top.send(JSON.stringify(message), function (event) {
            var data = JSON.parse(event.data);
            console.log("返回的消息:", data);
            if (data.code == "TCSYGetFinger" && data.result == "success") {
                console.log(data.data);
                $("#finger").val(data.data);
            } else {
                layer.alert("指纹读取失败，重新读取");
                sendFinger();
            }
        });
    }
</script>
</body>
</html>